﻿<!DOCTYPE html>
<html class="no-js" lang="en">
<head>
    <meta charset="utf-8">
    <title>十五组 - 网上购物商城</title>
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta property="og:title" content="">
    <meta property="og:type" content="">
    <meta property="og:url" content="">
    <meta property="og:image" content="">
    <link rel="shortcut icon" type="image/x-icon" href="../../imgs/theme/favicon.svg">
    <link rel="stylesheet" href="../../css/main.css?v=3.4">
</head>
<body>
<header class="header-area header-style-4 header-height-2">
    <div class="header-top header-top-ptb-1 d-none d-lg-block">
        <div class="container">
            <div class="row align-items-center">
                <div class="col-xl-3 col-lg-4">
                    <div class="header-info">
                        <ul>
                            <li><i class="fi-rs-smartphone"></i> <a href="#">10086</a></li>
                        </ul>
                    </div>
                </div>
                <div class="col-xl-6 col-lg-4">
                    <div class="text-center">
                        <div id="news-flash" class="d-inline-block">
                            <ul>
                                <li>最新校服上架，今天节省35%的折扣<a href="/url/prolist">查看详情</a></li>
                                <li>参与活动-节省更多的优惠券</li>
                                <li>最高可得50%的折扣 <a href="/url/prolist">立即购买</a></li>
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="col-xl-3 col-lg-4">
                    <div class="header-info header-info-right">
                        <ul>
                            <li><i class="fi-rs-user"></i><a href="/url/login">登录 / 注册</a></li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="header-middle header-middle-ptb-1 d-none d-lg-block">
        <div class="container">
            <div class="header-wrap">
                <div class="logo logo-width-1">
                    <a href="/url/index"><img src="../../imgs/theme/logo.png" alt="logo"></a>
                </div>
                <div class="header-right">
                    <div class="search-style-2">
                        <form action="" onsubmit="return false;">
                            <select class="select-active">
                                <option>所有分类</option>
                                <option>女装</option>
                                <option>内衣</option>
                                <option>男装</option>
                                <option>运动户外</option>
                                <option>女鞋</option>
                                <option>男鞋</option>
                                <option>箱包</option>
                                <option>美妆</option>
                                <option>个人护理</option>
                                <option>腕表</option>
                                <option>眼镜</option>
                                <option>珠宝饰品</option>
                                <option>手机</option>
                                <option>数码</option>
                                <option>电脑办公</option>
                                <option>母婴玩具</option>
                                <option>零食</option>
                                <option>茶酒</option>
                                <option>进口食品</option>
                                <option>生鲜水果</option>
                                <option>大家电</option>
                                <option>生活电器</option>
                                <option>家具</option>
                                <option>灯具</option>
                                <option>卫浴</option>
                                <option>汽车</option>
                                <option>配件</option>
                                <option>用品</option>
                                <option>家纺</option>
                                <option>家饰</option>
                                <option>鲜花</option>
                                <option>医药保健</option>
                                <option>厨具</option>
                                <option>收纳</option>
                                <option>宠物</option>
                                <option>图书音像</option>
                            </select>
                            <input id="keyword" type="text" placeholder="搜索商品..." v-model="keyword" @change="listProduct()">
                        </form>
                    </div>
                    <div class="header-action-right">
                        <div class="header-action-2">
                            <div class="header-action-icon-2">
                                <a class="mini-cart-icon" href="/url/cart">
                                    <img alt="Evara" src="../../imgs/theme/icons/icon-cart.svg">
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="header-bottom header-bottom-bg-color sticky-bar">
        <div class="container">
            <div class="header-wrap header-space-between position-relative">
                <div class="logo logo-width-1 d-block d-lg-none">
                    <a href="/url/index"><img src="../../imgs/theme/logo.png" alt="logo"></a>
                </div>
                <div class="header-nav d-none d-lg-flex">
                    <div class="main-menu main-menu-padding-1 main-menu-lh-2 d-none d-lg-block">
                        <nav>
                            <ul>
                                <li><a class="active" href="/url/index">主页 <i class="fi-rs-angle-down"></i></a>
                                    <ul class="sub-menu">
                                        <li><a href="/url/index">主页</a></li>
                                    </ul>
                                </li>
                                <li class="position-static"><a href="#">购物 <i class="fi-rs-angle-down"></i></a>
                                    <ul class="mega-menu">
                                        <li class="sub-mega-menu sub-mega-menu-width-22">
                                            <a class="menu-title" href="#">服装搭配</a>
                                            <ul>
                                                <li><a href="/url/prolist">女装</a></li>
                                                <li><a href="/url/prolist">内衣</a></li>
                                                <li><a href="/url/prolist">男装</a></li>
                                                <li><a href="/url/prolist">运动户外</a></li>
                                                <li><a href="/url/prolist">女鞋</a></li>
                                                <li><a href="/url/prolist">男鞋</a></li>
                                            </ul>
                                        </li>
                                        <li class="sub-mega-menu sub-mega-menu-width-22">
                                            <a class="menu-title" href="#">箱包首饰</a>
                                            <ul>
                                                <li><a href="/url/prolist">箱包</a></li>
                                                <li><a href="/url/prolist">美妆</a></li>
                                                <li><a href="/url/prolist">个人护理</a></li>
                                                <li><a href="/url/prolist">腕表</a></li>
                                                <li><a href="/url/prolist">眼镜</a></li>
                                                <li><a href="/url/prolist">珠宝饰品</a></li>
                                            </ul>
                                        </li>
                                        <li class="sub-mega-menu sub-mega-menu-width-22">
                                            <a class="menu-title" href="#">数码家电</a>
                                            <ul>
                                                <li><a href="/url/prolist">手机</a></li>
                                                <li><a href="/url/prolist">数码</a></li>
                                                <li><a href="/url/prolist">电脑办公</a></li>
                                                <li><a href="/url/prolist">大家电</a></li>
                                                <li><a href="/url/prolist">生活电器</a></li>
                                                <li><a href="/url/prolist">家具</a></li>
                                            </ul>
                                        </li>
                                        <li class="sub-mega-menu sub-mega-menu-width-34">
                                            <div class="menu-banner-wrap">
                                                <a href="/url/prolist"><img
                                                        src="../../imgs/banner/menu-banner.jpg" alt="Evara"></a>
                                                <div class="menu-banner-content">
                                                    <h4>热卖中</h4>
                                                    <h3>不要错过<br> 最近趋势</h3>
                                                    <div class="menu-banner-price">
                                                        <span class="new-price text-success">节省 50%</span>
                                                    </div>
                                                    <div class="menu-banner-btn">
                                                        <a href="/url/prolist">立即购买</a>
                                                    </div>
                                                </div>
                                                <div class="menu-banner-discount">
                                                    <h3>
                                                        <span>35%</span>
                                                        折扣
                                                    </h3>
                                                </div>
                                            </div>
                                        </li>
                                    </ul>
                                </li>
                                <li><a href="#">我的 <i class="fi-rs-angle-down"></i></a>
                                    <ul class="sub-menu">
                                        <li><a href="/url/info">我的信息</a></li>
                                        <li><a href="/url/login">退出登录</a></li>
                                    </ul>
                                </li>
                            </ul>
                        </nav>
                    </div>
                </div>
                <div class="hotline d-none d-lg-block">
                    <p><i class="fi-rs-headset"></i><span>联系热线</span> 10086 </p>
                </div>
                <p class="mobile-promotion">Happy <span class="text-brand">Mother's Day</span>. Big Sale Up to 40%</p>
                <div class="header-action-right d-block d-lg-none">
                    <div class="header-action-2">
                        <div class="header-action-icon-2">
                            <a href="shop-wishlist.html">
                                <img alt="Evara" src="../../imgs/theme/icons/icon-heart.svg">
                                <span class="pro-count white">4</span>
                            </a>
                        </div>
                        <div class="header-action-icon-2">
                            <a class="mini-cart-icon" href="shop-cart.html">
                                <img alt="Evara" src="../../imgs/theme/icons/icon-cart.svg">
                                <span class="pro-count white">2</span>
                            </a>
                            <div class="cart-dropdown-wrap cart-dropdown-hm2">
                                <ul>
                                    <li>
                                        <div class="shopping-cart-img">
                                            <a href="shop-product-full.html"><img alt="Evara"
                                                                                   src="../../imgs/shop/thumbnail-3.jpg"></a>
                                        </div>
                                        <div class="shopping-cart-title">
                                            <h4><a href="shop-product-full.html">Plain Striola Shirts</a></h4>
                                            <h3><span>1 × </span>￥800.00</h3>
                                        </div>
                                        <div class="shopping-cart-delete">
                                            <a href="#"><i class="fi-rs-cross-small"></i></a>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="shopping-cart-img">
                                            <a href="shop-product-full.html"><img alt="Evara"
                                                                                   src="../../imgs/shop/thumbnail-4.jpg"></a>
                                        </div>
                                        <div class="shopping-cart-title">
                                            <h4><a href="shop-product-full.html">Macbook Pro 2022</a></h4>
                                            <h3><span>1 × </span>￥3500.00</h3>
                                        </div>
                                        <div class="shopping-cart-delete">
                                            <a href="#"><i class="fi-rs-cross-small"></i></a>
                                        </div>
                                    </li>
                                </ul>
                                <div class="shopping-cart-footer">
                                    <div class="shopping-cart-total">
                                        <h4>Total <span>￥383.00</span></h4>
                                    </div>
                                    <div class="shopping-cart-button">
                                        <a href="shop-cart.html">View cart</a>
                                        <a href="shop-checkout.html">Checkout</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="header-action-icon-2 d-block d-lg-none">
                            <div class="burger-icon burger-icon-white">
                                <span class="burger-icon-top"></span>
                                <span class="burger-icon-mid"></span>
                                <span class="burger-icon-bottom"></span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</header>
<main class="main">
    <section class="home-slider position-relative mb-30">
        <div class="container">
            <div class="home-slide-cover bg-grey-10 mt-30">
                <div class="hero-slider-1 style-4 dot-style-1 dot-style-1-position-1">
                    <div class="single-hero-slider single-animation-wrap">
                        <div class="container">
                            <div class="row align-items-center slider-animated-1">
                                <div class="col-lg-5 col-md-6">
                                    <div v-if="showFlg == 1" class="hero-slider-content-2">
                                        <h4 class="animated">全新促销活动</h4>
                                        <h3 class="animated fw-900">物超所值</h3>
                                        <h2 class="animated fw-900 text-brand">适用于所有商品</h2>
                                        <p class="animated">节省更多的优惠券，高达 70% 的折扣</p>
                                        <a class="animated btn btn-brush btn-brush-3" href="/url/prolist"
                                           tabindex="0"> 立即购买 </a>
                                    </div>
                                    <div v-if="showFlg == 2" class="hero-slider-content-2">
                                        <h4 class="animated">火热促销活动</h4>
                                        <h3 class="animated fw-900">流行趋势</h3>
                                        <h2 class="animated fw-900 text-brand">查看完美搭配</h2>
                                        <p class="animated">节省更多的优惠券，高达 20% 的折扣</p>
                                        <a class="animated btn btn-brush btn-brush-1" href="/url/prolist"
                                           tabindex="0"> 立即获取 </a>
                                    </div>
                                </div>
                                <div class="col-lg-7 col-md-6">
                                    <div v-if="showFlg == 1" class="single-slider-img single-slider-img-1">
                                        <img class="animated" src="../../imgs/slider/slider-6.png" alt="">
                                    </div>
                                    <div v-if="showFlg == 2" class="single-slider-img single-slider-img-1">
                                        <img class="animated" src="../../imgs/slider/slider-7.png" alt="">
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="single-hero-slider single-animation-wrap">
                        <div class="container">
                            <div class="row align-items-center slider-animated-1">
                                <div class="col-lg-5 col-md-6">
                                    <div class="hero-slider-content-2">
                                        <h4 class="animated">火热促销活动</h4>
                                        <h3 class="animated fw-900">流行趋势</h3>
                                        <h2 class="animated fw-900 text-brand">查看完美搭配</h2>
                                        <p class="animated">节省更多的优惠券，高达 20% 的折扣</p>
                                        <a class="animated btn btn-brush btn-brush-1" href="/url/prolist"
                                           tabindex="0"> 立即获取 </a>
                                    </div>
                                </div>
                                <div class="col-lg-7 col-md-6">
                                    <div class="single-slider-img single-slider-img-1">
                                        <img class="animated" src="../../imgs/slider/slider-7.png" alt="">
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="slider-arrow hero-slider-1-arrow" @click="changeSlider()"></div>
            </div>
        </div>
    </section>
    <section class="banners mb-20">
        <div class="container">
            <div class="row">
                <div class="col-lg-4 col-md-6">
                    <div class="banner-img wow fadeIn animated">
                        <img src="../../imgs/banner/banner-1.png" alt="">
                        <div class="banner-text">
                            <span>为您推荐</span>
                            <h4>八折 <br>女生书包</h4>
                            <a href="/url/prolist">立即购买 <i class="fi-rs-arrow-right"></i></a>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 col-md-6">
                    <div class="banner-img wow fadeIn animated">
                        <img src="../../imgs/banner/banner-2.png" alt="">
                        <div class="banner-text">
                            <span>折扣优惠</span>
                            <h4>盛夏促销 <br>活动</h4>
                            <a href="/url/prolist">立即购买 <i class="fi-rs-arrow-right"></i></a>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 d-md-none d-lg-flex">
                    <div class="banner-img wow fadeIn animated  mb-sm-0">
                        <img src="../../imgs/banner/banner-3.png" alt="">
                        <div class="banner-text">
                            <span>新品到达</span>
                            <h4>今天购买 <br>减免优惠</h4>
                            <a href="/url/prolist">立即购买 <i class="fi-rs-arrow-right"></i></a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <section class="product-tabs pt-25 pb-20 wow fadeIn animated">
        <div class="container">
            <div class="row">
                <div class="col-lg-3">
                    <div class="widget-category mb-30">
                        <h5 class="section-title style-1 mb-30 wow fadeIn animated">分类</h5>
                        <ul class="categories">
                            <li><a href="/url/prolist">文具</a></li>
                            <li><a href="/url/prolist">图书</a></li>
                            <li><a href="/url/prolist">书包</a></li>
                            <li><a href="/url/prolist">报纸</a></li>
                            <li><a href="/url/prolist">女装</a></li>
                            <li><a href="/url/prolist">男装</a></li>


                        </ul>
                    </div>
                    <div class="widget-category mb-30">
                        <h5 class="section-title style-1 mb-30 wow fadeIn animated">排序</h5>
                        <ul class="categories">
                            <li><a href="/url/prolist">人气</a></li>
                            <li><a href="/url/prolist">评价</a></li>
                            <li><a href="/url/prolist">价格: 从低到高</a></li>
                            <li><a href="/url/prolist">价格: 从高到低</a></li>
                        </ul>
                    </div>
                    <div class="widget-category mb-30">
                        <h5 class="section-title style-1 mb-30 wow fadeIn animated">价格范围</h5>
                        <ul class="categories">
                            <li><a href="/url/prolist">￥0-￥200</a></li>
                            <li><a href="/url/prolist">￥200-￥400</a></li>
                            <li><a href="/url/prolist">￥400-￥600</a></li>
                            <li><a href="/url/prolist">￥600-￥800</a></li>
                            <li><a href="/url/prolist">￥800+</a></li>
                        </ul>
                    </div>
                    <div class="banner-img wow fadeIn mb-45mb-lg-0 animated d-lg-block d-none">
                        <img src="../../imgs/banner/banner-11.jpg" alt="">
                        <div class="banner-text">
                            <span>服装新品</span>
                            <h4>立即节省 17% <br>折扣优惠</h4>
                            <a href="/url/prolist">立即购买 <i class="fi-rs-arrow-right"></i></a>
                        </div>
                    </div>
                </div>
                <div class="col-lg-9">
                    <div class="tab-header">
                        <ul class="nav nav-tabs" id="myTab" role="tablist">
                            <li class="nav-item" role="presentation">
                                <button class="nav-link active" id="nav-tab-one" data-bs-toggle="tab"
                                        data-bs-target="#tab-one" type="button" role="tab" aria-controls="tab-one"
                                        aria-selected="true">人气
                                </button>
                            </li>
                            <li class="nav-item" role="presentation">
                                <button class="nav-link" id="nav-tab-two" data-bs-toggle="tab" data-bs-target="#tab-two"
                                        type="button" role="tab" aria-controls="tab-two" aria-selected="false">新品
                                </button>
                            </li>
                            <li class="nav-item" role="presentation">
                                <button class="nav-link" id="nav-tab-three" data-bs-toggle="tab"
                                        data-bs-target="#tab-three" type="button" role="tab" aria-controls="tab-three"
                                        aria-selected="false">推荐
                                </button>
                            </li>
                        </ul>
                        <a href="#" class="view-more d-none d-md-flex">查看更多<i
                                class="fi-rs-angle-double-small-right"></i></a>
                    </div>
                    <!--End nav-tabs-->
                    <div class="tab-content wow fadeIn animated" id="myTabContent">
                        <div class="tab-pane fade show active" id="tab-one" role="tabpanel" aria-labelledby="tab-one">
                            <div class="row product-grid-4">
                                <div class="col-lg-4 col-md-4 col-12 col-sm-6" v-for="item in productList1">
                                    <div class="product-cart-wrap mb-30">
                                        <div class="product-img-action-wrap">
                                            <div class="product-img product-img-zoom">
                                                <a :href="'/url/prodetail/'+item.proid">
                                                    <img class="default-img" v-if="item.mainimage == null" src="../../imgs/img.png" height="280px"
                                                         alt="">
                                                    <img class="default-img" v-if="item.mainimage != null" :src="item.mainimage" height="280px"
                                                         alt="">
                                                    <img class="hover-img" v-if="item.mainimage != null" :src="item.subimagesList.length > 0 ? item.subimagesList[0] : item.mainimage"
                                                         height="280px" alt="">
                                                </a>
                                            </div>
                                            <div class="product-action-1">
                                                <a aria-label="查看" class="action-btn hover-up" :href="'/url/prodetail/'+item.proid"><i
                                                        class="fi-rs-eye"></i></a>
                                            </div>
                                            <div class="product-badges product-badges-position product-badges-mrg">
                                                <span class="hot">人气</span>
                                            </div>
                                        </div>
                                        <div class="product-content-wrap">
                                            <div class="product-category">
                                                <a href="/url/prolist" v-text="item.category.name">服装</a>
                                            </div>
                                            <h2><a :href="'/url/prodetail/'+item.proid" v-text="item.name">彩色图案衬衫</a></h2>
                                            <div class="rating-result" title="90%">
                                                <span>
                                                <span>90%</span>
                                                </span>
                                            </div>
                                            <div class="product-price">
                                                <span v-text="'￥'+item.disprice">￥238.85 </span>
                                                <span class="old-price" v-text="'￥'+item.price">￥245.8</span>
                                            </div>
                                            <div class="product-action-1 show">
                                                <a aria-label="加入购物车" class="action-btn hover-up"
                                                   v-on:click="addCart(item.proid)"><i class="fi-rs-shopping-bag-add"></i></a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!--End product-grid-4-->
                        </div>
                        <!--En tab one (Featured)-->
                        <div class="tab-pane fade" id="tab-two" role="tabpanel" aria-labelledby="tab-two">
                            <div class="row product-grid-4">
                                <div class="col-lg-4 col-md-4 col-12 col-sm-6" v-for="item in productList2">
                                    <div class="product-cart-wrap mb-30">
                                        <div class="product-img-action-wrap">
                                            <div class="product-img product-img-zoom">
                                                <a :href="'/url/prodetail/'+item.proid">
                                                    <img class="default-img" v-if="item.mainimage == null" src="../../imgs/img.png" height="280px"
                                                         alt="">
                                                    <img class="default-img" v-if="item.mainimage != null" :src="item.mainimage" height="280px"
                                                         alt="">
                                                    <img class="hover-img" v-if="item.mainimage != null" :src="item.subimagesList.length > 0 ? item.subimagesList[0] : item.mainimage"
                                                         height="280px" alt="">
                                                </a>
                                            </div>
                                            <div class="product-action-1">
                                                <a aria-label="查看" class="action-btn hover-up" :href="'/url/prodetail/'+item.proid"><i
                                                        class="fi-rs-eye"></i></a>
                                            </div>
                                            <div class="product-badges product-badges-position product-badges-mrg">
                                                <span class="hot">人气</span>
                                            </div>
                                        </div>
                                        <div class="product-content-wrap">
                                            <div class="product-category">
                                                <a href="/url/prolist" v-text="item.category.name">服装</a>
                                            </div>
                                            <h2><a :href="'/url/prodetail/'+item.proid" v-text="item.name">彩色图案衬衫</a></h2>
                                            <div class="rating-result" title="90%">
                                                <span>
                                                <span>90%</span>
                                                </span>
                                            </div>
                                            <div class="product-price">
                                                <span v-text="'￥'+item.disprice">￥238.85 </span>
                                                <span class="old-price" v-text="'￥'+item.price">￥245.8</span>
                                            </div>
                                            <div class="product-action-1 show">
                                                <a aria-label="加入购物车" class="action-btn hover-up"
                                                   v-on:click="addCart(item.proid)"><i class="fi-rs-shopping-bag-add"></i></a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!--End product-grid-4-->
                        </div>
                        <!--En tab two (Popular)-->
                        <div class="tab-pane fade" id="tab-three" role="tabpanel" aria-labelledby="tab-three">
                            <div class="row product-grid-4">
                                <div class="col-lg-4 col-md-4 col-12 col-sm-6" v-for="item in productList3">
                                    <div class="product-cart-wrap mb-30">
                                        <div class="product-img-action-wrap">
                                            <div class="product-img product-img-zoom">
                                                <a :href="'/url/prodetail/'+item.proid">
                                                    <img class="default-img" v-if="item.mainimage == null" src="../../imgs/img.png" height="280px"
                                                         alt="">
                                                    <img class="default-img" v-if="item.mainimage != null" :src="item.mainimage" height="280px"
                                                         alt="">
                                                    <img class="hover-img" v-if="item.mainimage != null" :src="item.subimagesList.length > 0 ? item.subimagesList[0] : item.mainimage"
                                                         height="280px" alt="">
                                                </a>
                                            </div>
                                            <div class="product-action-1">
                                                <a aria-label="查看" class="action-btn hover-up" :href="'/url/prodetail/'+item.proid"><i
                                                        class="fi-rs-eye"></i></a>
                                            </div>
                                            <div class="product-badges product-badges-position product-badges-mrg">
                                                <span class="hot">人气</span>
                                            </div>
                                        </div>
                                        <div class="product-content-wrap">
                                            <div class="product-category">
                                                <a href="/url/prolist" v-text="item.category.name">服装</a>
                                            </div>
                                            <h2><a :href="'/url/prodetail/'+item.proid" v-text="item.name">彩色图案衬衫</a></h2>
                                            <div class="rating-result" title="90%">
                                                <span>
                                                <span>90%</span>
                                                </span>
                                            </div>
                                            <div class="product-price">
                                                <span v-text="'￥'+item.disprice">￥238.85 </span>
                                                <span class="old-price" v-text="'￥'+item.price">￥245.8</span>
                                            </div>
                                            <div class="product-action-1 show">
                                                <a aria-label="加入购物车" class="action-btn hover-up"
                                                   v-on:click="addCart(item.proid)"><i class="fi-rs-shopping-bag-add"></i></a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!--End product-grid-4-->
                        </div>
                        <!--En tab three (New added)-->
                    </div>
                    <!--End tab-content-->
                </div>
            </div>
        </div>
    </section>
    <section class="banner-2 section-padding pb-0">
        <div class="container">
            <div class="banner-img banner-big wow fadeIn animated f-none">
                <img src="../../imgs/banner/banner-4.png" alt="">
                <div class="banner-text d-md-block d-none">
                    <h4 class="mb-15 mt-40 text-brand">7天无条件免费退换</h4>
                    <h1 class="fw-600 mb-20">我们的商品质量 <br>值得您的信赖</h1>
                    <a href="/url/prolist" class="btn">查看更多 <i class="fi-rs-arrow-right"></i></a>
                </div>
            </div>
        </div>
    </section>
    <section class="popular-categories section-padding mt-15">
        <div class="container wow fadeIn animated">
            <h3 class="section-title mb-20"><span>人气</span> 商品</h3>
            <div class="carausel-6-columns-cover position-relative">
                <div class="slider-arrow slider-arrow-2 carausel-6-columns-arrow" id="carausel-6-columns-arrows"></div>
                <div class="carausel-6-columns" id="carausel-6-columns">
                    <div class="card-1">
                        <figure class=" img-hover-scale overflow-hidden">
                            <a href="/url/prolist"><img src="../../imgs/shop/category-thumb-1.jpg" alt=""></a>
                        </figure>
                        <h5><a href="/url/prolist">T恤</a></h5>
                    </div>
                    <div class="card-1">
                        <figure class=" img-hover-scale overflow-hidden">
                            <a href="/url/prolist"> <img src="../../imgs/shop/category-thumb-2.jpg" alt=""></a>
                        </figure>
                        <h5><a href="/url/prolist">手提包</a></h5>
                    </div>
                    <div class="card-1">
                        <figure class=" img-hover-scale overflow-hidden">
                            <a href="/url/prolist"><img src="../../imgs/shop/category-thumb-3.jpg" alt=""></a>
                        </figure>
                        <h5><a href="/url/prolist">Sandan</a></h5>
                    </div>
                    <div class="card-1">
                        <figure class=" img-hover-scale overflow-hidden">
                            <a href="/url/prolist"><img src="../../imgs/shop/category-thumb-4.jpg" alt=""></a>
                        </figure>
                        <h5><a href="/url/prolist">围巾帽</a></h5>
                    </div>
                    <div class="card-1">
                        <figure class=" img-hover-scale overflow-hidden">
                            <a href="/url/prolist"><img src="../../imgs/shop/category-thumb-5.jpg" alt=""></a>
                        </figure>
                        <h5><a href="/url/prolist">鞋类</a></h5>
                    </div>
                    <div class="card-1">
                        <figure class=" img-hover-scale overflow-hidden">
                            <a href="/url/prolist"><img src="../../imgs/shop/category-thumb-6.jpg" alt=""></a>
                        </figure>
                        <h5><a href="/url/prolist">靠枕</a></h5>
                    </div>
                    <div class="card-1">
                        <figure class=" img-hover-scale overflow-hidden">
                            <a href="/url/prolist"><img src="../../imgs/shop/category-thumb-7.jpg" alt=""></a>
                        </figure>
                        <h5><a href="/url/prolist">连身裤</a></h5>
                    </div>
                    <div class="card-1">
                        <figure class=" img-hover-scale overflow-hidden">
                            <a href="/url/prolist"><img src="../../imgs/shop/category-thumb-8.jpg" alt=""></a>
                        </figure>
                        <h5><a href="/url/prolist">帽子</a></h5>
                    </div>
                </div>
            </div>
        </div>
    </section>
</main>
<footer class="main">
    <section class="newsletter p-30 text-white wow fadeIn animated">
        <div class="container">
            <div class="row align-items-center">
                <div class="col-lg-7 mb-md-3 mb-lg-0">
                    <div class="row align-items-center">
                        <div class="col my-4 my-md-0 des">
                            <h5 class="font-size-15 ml-4 mb-0">立即获取<strong> 25元优惠券
                            </strong>首单购物。</h5>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <section class="section-padding footer-mid">
        <div class="container pt-15 pb-20">
            <div class="row">
                <div class="col-lg-4 col-md-6">
                    <div class="widget-about font-md mb-md-5 mb-lg-0">
                        <div class="logo logo-width-1 wow fadeIn animated">
                            <a href="/url/index"><img src="../../imgs/theme/logo.png" alt="logo"></a>
                        </div>
                        <h5 class="mt-20 mb-10 fw-600 text-grey-4 wow fadeIn animated">联系方式</h5>
                        <p class="wow fadeIn animated">
                            <strong>地址: </strong>中工软院软工金十五组
                        </p>
                        <p class="wow fadeIn animated">
                            <strong>电话: </strong>10086
                        </p>
                        <p class="wow fadeIn animated">
                            <strong>工作时间: </strong>10:00 - 18:00, 周一 - 周日
                        </p>
                        <h5 class="mb-10 mt-30 fw-600 text-grey-4 wow fadeIn animated">关注我们</h5>
                    </div>
                </div>
                <div class="col-lg-2 col-md-3">
                    <h5 class="widget-title wow fadeIn animated">服装搭配</h5>
                    <ul class="footer-list wow fadeIn animated mb-sm-5 mb-md-0">
                        <li><a href="/url/prolist">男生校服上衣</a></li>
                        <li><a href="/url/prolist">女生校服上衣</a></li>
                        <li><a href="/url/prolist">男生校服裤子</a></li>
                        <li><a href="/url/prolist">女生校服裤子</a></li>
                        <li><a href="/url/prolist">女生运动鞋</a></li>
                        <li><a href="/url/prolist">男生运动鞋</a></li>
                    </ul>
                </div>

            </div>
        </div>
    </section>
    <div class="container pb-20 wow fadeIn animated">
        <div class="row">
            <div class="col-12 mb-20">
                <div class="footer-bottom"></div>
            </div>
            <div class="col-lg-6">
                <p class="float-md-left font-sm text-muted mb-0">&copy; 2024, <strong class="text-brand">Evara</strong>
                    - 网上购物商城 </p>
            </div>
            <div class="col-lg-6">
                <p class="text-lg-end text-start font-sm text-muted mb-0">
                    Designed by <a href="#" target="_blank">Alithemes.com</a>. All rights
                    reserved
                </p>
            </div>
        </div>
    </div>
</footer>
<div id="preloader-active">
    <div class="preloader d-flex align-items-center justify-content-center">
        <div class="preloader-inner position-relative">
            <div class="text-center">
                <h5 class="mb-5">Now Loading</h5>
                <div class="loader">
                    <div class="bar bar1"></div>
                    <div class="bar bar2"></div>
                    <div class="bar bar3"></div>
                </div>
            </div>
        </div>
    </div>
</div>
<script src="../../js/vendor/modernizr-3.6.0.min.js"></script>
<script src="../../js/vendor/jquery-3.6.0.min.js"></script>
<script src="../../js/vendor/jquery-migrate-3.3.0.min.js"></script>
<script src="../../js/vendor/bootstrap.bundle.min.js"></script>
<script src="../../js/plugins/slick.js"></script>
<script src="../../js/plugins/jquery.syotimer.min.js"></script>
<script src="../../js/plugins/wow.js"></script>
<script src="../../js/plugins/jquery-ui.js"></script>
<script src="../../js/plugins/perfect-scrollbar.js"></script>
<script src="../../js/plugins/magnific-popup.js"></script>
<script src="../../js/plugins/select2.min.js"></script>
<script src="../../js/plugins/waypoints.js"></script>
<script src="../../js/plugins/counterup.js"></script>
<script src="../../js/plugins/jquery.countdown.min.js"></script>
<script src="../../js/plugins/images-loaded.js"></script>
<script src="../../js/plugins/isotope.js"></script>
<script src="../../js/plugins/scrollup.js"></script>
<script src="../../js/plugins/jquery.vticker-min.js"></script>
<script src="../../js/plugins/jquery.theia.sticky.js"></script>
<script src="../../js/plugins/jquery.elevatezoom.js"></script>
<script src="../../js/main.js?v=3.4"></script>
<script src="../../js/shop.js?v=3.4"></script>
<script src="../../js/vue.global.js"></script>
<script src="../../js/axios.min.js"></script>
</body>
<script>
    const app = {
        data() {
            return {
                productList1: [],
                productList2: [],
                productList3: [],
                showFlg: 1
            }
        },
        methods: {
            addCart: function (id) {
                let data = {
                    proid: id
                }
                axios.post('/cart/create',data)
                    .then((response) => {
                        if (response.data.code == 200) {
                            alert('添加成功')
                        } else {
                            alert('添加失败')
                        }
                    })
                    .catch((error) => {
                        console.error(error);
                        alert('添加失败')
                    })
            },
            changeSlider: function () {
                if (this.showFlg == 1) {
                    this.showFlg = 2
                } else {
                    this.showFlg = 1
                }
            },
            listProduct: function () {
                location.href = '/url/prolist?keyword=' + this.keyword
            },
        },
        created() {
            let _this = this
            axios.get('/product/indexdata')
                .then((response) => {
                    _this.productList1 = response.data.data.productList1
                    _this.productList2 = response.data.data.productList2
                    _this.productList3 = response.data.data.productList3
                })
                .catch((error) => {
                    console.error(error);
                    alert('初期化错误')
                })
        }
    }
    Vue.createApp(app).mount('body')
</script>
</html>